<%@page contentType="text/html; charset=utf-8"%>

<script>
	var tabsContainer, $tg, $menu, resourceIds ;
	$(function() {
		tabsContainer = $("#tabsContainer").tabs({
			fit: true, border: false
		}) ;
		$('#icheck input').iCheck({
			checkboxClass: 'icheckbox_minimal-blue',
			radioClass: 'iradio_square-blue'
	   	});
		
		baseinfo();
		
		loadMenu();
	});
	
	function baseinfo() {
		$.ajax({
			type: "GET", dataType: "JSON",
			url: "${ctx}/admin/sys/user/get/${currentUser.user.id}",
			success: function(result) {
				$("input[name=sex]").iCheck('disable') ;
				$("input[name=sex][value="+result.sex+"]").iCheck('check') ;
				
				$("input[name=username]").prop("disabled", true) ;
				
				$("#base-form").form("load", result);
			},
			complete: function(XMLHttpRequest, textStatus){},
			error: function(){
				$.easyui.loaded();
				alert("请求出错处理") ;
			}
		});
	}
	function updateBaseInfo() {
		if($("#base-form").form("validate")) {
			$.easyui.loading({ msg: "数据提交中，请稍等..." });
			$.post("${ctx}/admin/sys/user/update", $("#base-form").form("getData"), function(result) {
				if (result.status) {
					$.easyui.loaded(); $.messager.alert("信息", result.message, "info");
				} else {
					$.easyui.loaded();$.messager.alert("错误", result.message, "error");
				}
			}, 'json').error(function() { $.easyui.loaded(); });
		}
	}
	
	function loadMenu(){
		$menu = $("#menu").combobox({
			url: "${ctx}/admin/sys/menu/listAll",
			valueField: "id", textField: "name", panelHeight: "auto",
			onSelect: function(record) {
				$tg.treegrid({url: "${ctx}/admin/sys/role/resourceTree?menuId="+record.id}) ;
			},
			onLoadSuccess: function() {
				var data= $menu.combobox("getData") ;
				if(data.length > 0) {
					$menu.combobox("setValue", data[0].id);
					$tg.treegrid({url: "${ctx}/admin/sys/role/resourceTree?menuId="+data[0].id}) ;
				} else {
					$("button").attr("onclick", "").click(function(){
						alertify.warning("目前没有菜单，请先创建菜单！");
					}); ;
				}
			}
		});
		
		loadResource() ;
	}
	function loadResource() {
		$tg = $("#tg").treegrid({
            idField: "id", treeField: "name", fit: true, autoRowHeight: true, 
            border: false, striped:true, singleSelect: true,rownumbers: true, 
            sortName: 'weight', sortOrder: 'asc',
            frozenColumns: [[
                { field: "id", title: "ID", width: 50, hidden: true },
                { field: "name", title: "资源名称", width: 180 },
            ]],
            columns: [[
                { field: 'operations', title: '操作权限', formatter: function(val, row, index){
                	var opers = "";
                	if(undefined != row.operations && row.operations.length > 0) {
	                	$.each(val, function(i, p){
	                		var chk = "<span id='icheck'><input id='oper_"+p.id+"' type='checkbox' name='operation_id' value='"+p.id+"' class='index_"+row.id+"'> <label class='irl' for='oper_"+p.id+"'>"+ p.name+"</label></span>　" ;
	                		opers += chk ;
	                	});
                	}
                	return opers ;
	            }}
            ]],
            onLoadSuccess: function(){
            	$.fn.treegrid.extensions.onLoadSuccess.apply(this, arguments);
            	$tg.treegrid('unselectAll');$tg.treegrid('clearSelections');
            	
            	$("#icheck input[type=checkbox][name=operation_id]").iCheck({
        			checkboxClass: 'icheckbox_square-red'
        	   	}).iCheck('disable');
            	
            	$.ajax({
        			type: "GET", dataType: "JSON",
        			url: "${ctx}/admin/sys/resource/getUserResourceOperations/${currentUser.user.id}",
        			success: function(result) {
        				resourceIds = result ;
        				
        				$("#icheck input[type=checkbox]").iCheck({
                			checkboxClass: 'icheckbox_square-red'
                	   	});
                    	
                    	if(resourceIds) {
                    		$.each(resourceIds, function(i, v) {
                    			$("#icheck #oper_"+v).iCheck('check') ;
                    		});
                    	}
        			},
        			complete: function(XMLHttpRequest, textStatus){},
        			error: function(){
        				$.easyui.loaded();
        				alert("请求出错处理") ;
        			}
        		});
            },
            enableHeaderClickMenu: true, enableHeaderContextMenu: true, enableRowContextMenu: false
        });
	}
	
</script>

<div id="tabsContainer">
	<div class="panel-container" data-options="title: '账号信息', iconCls: 'icon-standard-layout-header', refreshable: false, selected: true">
		<div class="myinfo">
			<div class="form-container">
				<form id="base-form">
					<table class="tableform">
						<tr>
							<th>用户名：</th>
							<td>
								<input name="username" class="easyui-validatebox" type="text" />
							</td>
						</tr>
						<tr>
							<th class="td100">真实姓名：</th>
							<td><input name="truename" class="easyui-validatebox" type="text" data-options="required: true, validType: 'chsEngNum'"/></td>
						</tr>
						<tr>
							<th>手机号码：</th>
							<td>
								<input name="mobile_phone_number" class="easyui-validatebox" type="text" />
							</td>
						</tr>
						<tr>
							<th>邮箱地址：</th>
							<td>
								<input name="email" class="easyui-validatebox" type="text" />
							</td>
						</tr>
						<tr>
							<th>性别：</th>
							<td>
								<div id="icheck">
									<input id="sex1" type="radio" name="sex" value="男" checked="checked">
									<label class="irl" for="sex1">男</label>　
									<input id="sex2" type="radio" name="sex" value="女">
									<label class="irl" for="sex2">女</label>
								</div>
							</td>
						</tr>
						<tr style="display:none">
							<td>
								<input type="hidden" name="id">
								<input type="hidden" name="admin">
								<input type="hidden" name="deleted">
								<input type="hidden" name="status">
							</td>
						</tr>
					</table>
				</form>
			</div>
		</div>
		<div class="myinfo-bto">
			<button type="button" onclick="updateBaseInfo();" class="btn btn-green btn-xs height-25 mt-5 mr-10"><div class='icon-div'><i class='fa fa-save fa-120 pt-2'></i></div> 保存</button>
		</div>		
			
	</div>
	
	
	<div class="panel-container" data-options="title: '权限信息', iconCls: 'icon-standard-layout-header', refreshable: false, selected: true">
		<div style="width: 100%;height: 34px; background: #eee;display: table;">
			<div class="ml-10 mt-4">
         		<input id="menu" class="easyui-validatebox" type="text" style="width: 150px; height: 25px;" />
        	</div>
		</div>
		<div class="myinfo" style="">
			<div id="tg"></div>
		</div>
	</div>
	
	
	<div id="skillform" class="panel-container" data-options="title: '个人档案', iconCls: 'icon-standard-layout-header', refreshable: false">
	
	</div>
</div>


